@import "material-icons/iconfont/filled.css";
@import "material-icons/iconfont/outlined.css";

:root {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

mdui-chip::part(button) {
  padding: 2px 3px;
  font-size: 12px;
}

mdui-text-field {
  margin-top: 8px;
}

:is(mdui-text-field[autosize], mdui-text-field[rows])::part(input) {
  font-family: monospace;
  font-size: 12px;
  line-height: 16px;
}

.ui {
  border-radius: 10px;
  margin: 6px auto;
}

.center {
  text-align: center;
  width: 100%;
  font-size: 15px;
}

.flex-around {
  display: flex;
  justify-content: space-around;
}

.no-highlight {
  -webkit-tap-highlight-color: transparent;
}

.mdui-theme-light {
  .ui {
    background-color: #fff;
    border: 1px solid #6f8de1;
    > mdui-icon {
      color: #6f8de1;
    }
  }
  mdui-card[title] {
    background-color: #fff;
  }
}

.mdui-theme-dark {
  .ui {
    background-color: #000;
    border: 1px solid #6f8de1;
    > mdui-icon {
      color: #6f8de1;
    }
  }
  mdui-card[title] {
    background-color: #000;
  }
}
